<!-- 预约等级列表页 -->
<template>
  <div style="overflow-y: auto; margin-bottom: 10px; padding-bottom: 10px">
    <!-- <div class="btcont">
      <span @click="checkHandle('des')">表单设计</span>
      <span @click="checkHandle('render')">表单渲染</span>
      <span @click="subCanchFn()">数据暂存</span>
      <span @click="subFn">数据提交</span>
    </div> -->
    <div ref="nodeTag" class="formDes"></div>
  </div>
</template>

<script>
import "/public/build";
import "/public/assets/build.css";
import request from "@/utils/request";

const ctFromApp = window.createForm;

export default {
  props: {
    formData: {
      type: Object,
      default: {},
    },
    currentRoutePath: {
      type: String,
      default: "",
    },
  },
  components: {},
  data() {
    return {
      red: "des",
      paramsData: {
        type: "render",
        formRoute: {
          type: "render",
          path: this.currentRoutePath
            ? this.currentRoutePath
            : "/handler-bis/:id",
        },
        baseURL: {
          host: window["HISS_URL"] || "http://localhost:8081",
          urlPrefix: "",
          url: "",
        },
        request: request,
        baseData: { ...this.formData },
        history: "Hash",
      },
      formApp: () => {},
    };
  },
  mounted() {
    console.log("表单的模式：", this);
    let hissConfig = this["_"];
    if (hissConfig) {
      console.log("表单的模式1：", hissConfig);
      hissConfig = hissConfig.appContext;
      if (hissConfig) {
        console.log("表单的模式2：", hissConfig);
        hissConfig = hissConfig.app;
        if (hissConfig && hissConfig.hissConfig) {
          console.log("表单的模式3：", hissConfig);
          hissConfig = hissConfig.hissConfig;
          this.paramsData.history = hissConfig.history;
        }
      }
    }
    console.log("表单的模式：", hissConfig, this.paramsData);
    this.formApp = ctFromApp(this.paramsData);
    this.renderComp();
  },
  methods: {
    checkHandle(val) {
      this.paramsData.type = val;
      this.paramsData.formRoute.type = val;
      this.formApp = ctFromApp(this.paramsData);
      this.renderComp();
    },
    renderComp() {
      this.formApp.mount(this.$refs.nodeTag);
    },
    handleSend() {
      return this.formApp.submitFn().then((res) => {
        if (res.success) {
          // 回传formId
          res.data.formId = this.formData.formId;
        }
        return res;
      });
    },
    handleDraft() {
      return this.formApp.submitCatchFn().then((res) => {
        if (res.success) {
          // 回传formId
          res.data.formId = this.formData.formId;
        }
        return res;
      });
    },
  },
};
</script>

<style>
.bg-wt {
  background-color: #fafafa;
}
.btcont span {
  display: inline-block;
  background-color: blue;
  color: #fff;
  cursor: pointer;
  border: solid 1px #ccc;
  border-radius: 3px;
  padding: 0px 10px;
  margin: 10px;
}
</style>
